<template>
  <div class="app-container" v-loading="loading">
    <!-- 催收处理查看 -->
    <!-- <shortcutButton v-model="form" :type="$route.query.type" /> -->
    <el-row :gutter="10">
      <el-col :span="19">
        <customerInformation v-model="customerList" :type="$route.query.type" />
        <collectionResult v-model="form" />
        <otherCollectionDetail v-model="form" />
      </el-col>
      <el-col :span="5" style="margin-top: 10px;">
        <OperationRecordCop :logs="logs" />
      </el-col>
    </el-row>
    <div style="text-align: right;box-sizing: border-box;padding-right: 20px;margin-top: 20px; background-color: #fff;width: 100%;height: 60px;line-height: 60px;border-radius: 8px;">
      <el-button @click="cancel">返回</el-button>
    </div>
  </div>
</template>

<script>
import customerInformation from "../components/customerInformation";
import collectionResult from "../components/collectionResult";
import otherCollectionDetail from "../components/otherCollectionDetail";
import shortcutButton from "../components/shortcutButton";
import OperationRecordCop from "@/views/contractTemplate/components/OperationRecordCop.vue";
import { getCollectionHandleDetail } from "@/api/collectionModule";
export default {
  // 发起催单
  name: 'InitiateACollectionDetailResult',
  components: {
    customerInformation,
    collectionResult,
    otherCollectionDetail,
    shortcutButton,
    OperationRecordCop
  },
  data() {
    return {
      customerList: [],
      form: {},
      logs: [],
      loading: false,
    };
  },
  created() {
    this.getCollectionHandleDetail()
  },
  methods: {
    // 催收管理详情
    async getCollectionHandleDetail() {
      this.loading = true
      try {
        let res = await getCollectionHandleDetail(this.$route.query.id)
        this.form = res.data;
        this.logs = res.data.logs
        this.customerList = [{ customer: res.data.customer, overdueInformation: res.data.overdueInformation, totalOfReceivableAmount: res.data.totalOfReceivableAmount, totalOfWaitAmount: res.data.totalOfWaitAmount, totalOfReceivedAmount: res.data.totalOfReceivedAmount, totalWriteOffAmount: res.data.totalWriteOffAmount, totalOfThisMonth: res.data.totalOfThisMonth, totalOfToDay: res.data.totalOfToDay, code: res.data.code, collectionProgress: res.data.collectionProgress, totalOfCanWritableAmount: res.data.totalOfCanWritableAmount, totalWriteOffAmount: res.data.totalWriteOffAmount }]
        this.loading = false
      } catch (error) {
        this.loading = false
      }
    },
    cancel() {
      this.$tab.closeOpenPage(this.$route);
      this.$router.go(-1)
    },
  },
};
</script>
<style lang="scss" scoped>
.app-container {
  overflow: auto !important;
}
</style>
